<template>
  <div>
      <button @click="modalOpen=true">弹出一个模态窗口</button>
      <teleport to="body">
        <div v-if="modalOpen" class="modal">
          <p>这里是teleport内容</p>
          <button @click="modalOpen = false">关闭</button>
        </div>
      </teleport>
  </div>
</template>

<script>
export default {
  data() { 
    return {
      modalOpen: false
    }
  },
 }
</script>

<style scoped>
.modal{
  position: fixed;
  width: 300px;
  height: 200px;
  background: gray;
  margin-left: 50%;
  margin-top: 50%;
}
</style>